<template>
    <div>
        <el-form label-width="100px" :model="hrteam" :rules="rules"
                 ref="recordForm"
                 class="demo-ruleForm" >
                <el-row>
                    <el-col :span="10">
                        <el-form-item label="团队名称:" prop="teamName">
                            <el-input :disabled="disabled" v-model="hrteam.teamName" size="small"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="10">
                        <el-form-item label="负责人:" prop="teamPrincipal">
                            <el-cascader :disabled="disabled" clearCheckedNodes @change="getPrincipal" style="width: 100%" :v-model="hrteam.teamPrincipal" :options="hremp" :props="{multiple: true,emitPath:true,label:'empName',value:'empName' }" collapse-tags clearable :placeholder=hrteam.teamPrincipal ></el-cascader>

                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row>
                    <el-col>
                        <el-form-item label="负责员工:" prop="teamMember">
                            <el-cascader :disabled="disabled" clearCheckedNodes @change="getteamMember" style="width: 82%"  :v-model="hrteam.teamMember" :options="hremp" :props="{multiple: true,emitPath:true,label:'empName',value:'empName' }" collapse-tags clearable  :placeholder=hrteam.teamMember></el-cascader>
                        </el-form-item></el-col>
                </el-row>
                <el-row>
                    <el-col >
                        <el-form-item label="备注:">
                            <el-input type="textarea" :rows="3" v-model="hrteam.teamIntro" style="width: 82%"  :disabled="disabled" size="small"></el-input>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row style="margin-left: 100px">
                    <el-col>
                        <el-button type="primary" @click="HrteamAdd('recordForm')" :disabled="disable">提交</el-button>
                        <el-button @click="coles">取消</el-button>
                    </el-col>
                </el-row>
        </el-form>
    </div>
</template>

<script>
    import hremp from "../../../model/gsl/HrEmp/hremp";
    const hrt=hremp.getInstance();
    export default {
        components: {},
        props:["hrteamall","tue"],
        data() {
            var teamName = (rule, value, callback) => {
                value=this.hrteam.teamName;
                if (!value) {
                    this.disable=true;
                    callback(new Error('请输入团队名称'));
                } else {
                    callback();
                    this.disable=false;
                }
            };
            var teamPrincipal = (rule, value, callback) => {
                value=this.hrteam.teamPrincipal;
                if (!value) {
                    this.disable=true;
                    callback(new Error('管理人不能为空'));
                } else {
                    callback();
                    this.disable=false;
                }
            };
            var teamMember = (rule, value, callback) => {
                value=this.hrteam.teamMember;
                if (!value) {
                    this.disable=true;
                    callback(new Error('请输入组员'));
                } else {
                    callback();
                    this.disable=false;
                }
            };
            return {
                hrteam: JSON.parse(JSON.stringify(this.hrteamall)),//父类传来的数据
                disable:true,//提交按钮是否隐藏
                disabled:this.tue,//前台传递的参数
                hremp:[],
                n:[],
                aa:'',
                rules:{
                    teamName: [{ required: true,validator: teamName, trigger: 'blur' }],
                    teamPrincipal: [{ required: true,validator: teamPrincipal, trigger: 'change' }],
                    teamMember: [{ required: true,validator: teamMember, trigger: 'change' }],
                    }
            };
        },
        created() {

            this.Hrteamsag();
        },
        methods: {
            handleClose(tag) {
                this.dynamicTags.splice(this.dynamicTags.indexOf(tag), 1);
            },
            Hrteamsag() {
                hrt.list(null).then((re) => {
                    this.hremp = re.data.data;
                })

            },
            getteamMember(m){
                this.hrteam.teamMember="";

                for (let index = 0; index < m.length; index++) {
                    this.hrteam.teamMember+=m[index]+","
                }
                console.log(this.hrteam.teamMember)
            },
            getPrincipal(m){
                this.hrteam.teamPrincipal="";

                for (let index = 0; index < m.length; index++) {
                    this.hrteam.teamPrincipal+=m[index]+","
                }
                console.log(this.hrteam.teamPrincipal)
            },
            HrteamAdd(formName){
                this.$refs[formName].validate((valid) => {
                    if (valid) {
                        console.log(this.hrteam)
                        this.$emit('AddHrTeam',this.hrteam);

                    } else {
                        console.log('error submit!!');
                        return false;
                    }
                });
            },
            coles(){
                this.$emit('coles',this.ad=1);
            }
        }
    }
</script>

<style scoped>

</style>
